<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>行政班级管理</title>
  <layuicss/>
  <link rel="stylesheet" href="__PUBLIC__/static/css/global.css" media="all">
  <link rel="stylesheet" href="__PUBLIC__/static/css/collegeList.css" />
    <style type="text/css">
    .layui-input-inline{
      width: 100px;
      height: 30px;
      line-height: 30px;
    }
     .layui-input, .layui-select,
    .layui-textarea {
    background-color: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 2px;
    height: 30px;
    line-height: 38px;
  }
  </style>
  </head>
	 <body>
   <div class="admin-main">
      <blockquote class="layui-elem-quote">
       <form class="layui-form" style="display: inline-block;margin-left: 20px; min-height: inherit; vertical-align: bottom;">
        <a href="javascript:;" class="layui-btn layui-btn-small add">
          <i class="layui-icon">&#xe608;</i> 添加班级
        </a>
         <span>年级:</span>
        <div class="layui-input-inline long"  >
        <select style="height:30px; line-height:30px;" name="grade" lay-verify="" id="grade">
          <option value=""></option>
          <volist name="gradelst" id="vo">
          <option id="gradename" value="{$vo.id}">{$vo.name}</option>
          </volist>
        </select> 
        </div>
        <a href="javascript:;" class="layui-btn layui-btn-small" id="find">
          <i class="layui-icon">&#xe615;</i> 查询
        </a>
        <div class="layui-input-block" style="display: inline-block;margin-left: 30px; min-height: inherit; vertical-align: bottom;">
          <div class="layui-form-pane">
          <label class="layui-form-label" style="padding: 4px 15px;">时间范围</label>
          <div class="layui-input-inline">
              <input class="layui-input" placeholder="开始日期" id="beginDate" name="beginDate" style="height:30px; line-height:30px;"  value="{$beginDate|default=''}" readonly="true">
            </div>
            <div class="layui-input-inline">
              <input class="layui-input" placeholder="结束日期" id="endDate" name="endDate" style="height:30px; line-height:30px;" value="{$endDate|default=''}" readonly="true">
            </div>
          </div>
        </div>
        <div class="layui-input-block" style="display: inline-block; margin-left: 30px; min-height: inherit; vertical-align: bottom;">
          <input type="text" name="keyword" id="keyword" required lay-verify="keyword" class="layui-input" autocomplete="off" placeholder="请输入搜索关键词" style="height: 30px; line-height: 30px;" value="{$keyword|default=''}">
        </div>
        <a href="javascript:;" class="layui-btn layui-btn-small" id="search">
          <i class="layui-icon">&#xe615;</i> 搜索
        </a>
        <a href="javascript:;" class="layui-btn layui-btn-small" id="searchAll">
          <i class="layui-icon">&#xe615;</i> 查看全部
        </a>
        </form>
      </blockquote>
      <fieldset class="layui-elem-field">
        <legend>行政班级列表</legend>
        <div class="layui-field-box">
          <table class="site-table table-hover">
            <thead>
              <tr>
               <th>班级名称</th>
                <th>年级名称</th>
                <th>学院名称</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody>
              <volist name="classlst" id="vo">
              <tr>
              <td>{$vo.name}</td>
              <td>{$vo.grade_name}</td>
              <td>{$vo.college_name}</td>
                <td>
                  <a href="javascript:;" data-id="{$vo.id}" class="layui-btn layui-btn-mini edit">编辑</a>
                  <a href="javascript:;" data-id="{$vo.id}" data-opt="del" class="layui-btn layui-btn-danger layui-btn-mini del">删除</a>
                </td>
              </tr>
              </volist>
            </tbody>
          </table>
        </div>
      </fieldset>
      <div class="admin-table-page">
        <div id="page" class="page">
      </div>
      </div>
  </div>
<layuijs/>
<script type="text/javascript">
  var editurl = "{:U('Home/classMgr/editClass')}";
  var listurl = "{:U('Home/classMgr/classList')}";
  var deleteurl = "{:U('Home/classMgr/deleteclass')}"
  var rooturl = "__ROOT__/";
  var pages = {$pages};
  var curr = {$requestPage};
</script>
</body>
</html>
<script type="text/javascript">
layui.use(['layer','form','jquery','laypage','laydate'],function(){
  var layer = layui.layer,
  form = layui.form(),
  laypage = layui.laypage,
  laydate = layui.laydate,
  $ = layui.jquery;
 form.render('select');

  $('.add').on('click', function(){
    layer.open({
      type: 2,
      title: ['添加行政班级', 'text-align:center;'],
      content: editurl+"?type=add_class",
      area:['500px', '350px'],  //宽高
      resize: false,    //是否允许拉伸
      scrollbar: false,
      end: function(){
        location.reload();
      }
    });
  });
    laypage({
    cont: 'page',
    pages: pages ,//总页数
    // skin:'#AF0000',
    skip:true, //显示跳页
    groups: 5, //连续显示分页数
    curr: curr,//获得当前页码
    jump: function(obj, first) {
      //得到了当前页，用于向服务端请求对应数据
      var curr = obj.curr;
      if(!first) {
        window.location.href=listurl+"?requestPage="+curr;
      }
    }
  });
  //点击搜索按钮的事件处理
  $('#search').on('click', function() {
    var keyword = $("#keyword").val();
    var beginDate = $('#beginDate').val();
    var endDate = $('#endDate').val();
    var bd = new Date(beginDate);
    var ed = new Date(endDate);
    var searchword = "";

    if (beginDate == "" && endDate == "" && keyword == ""){
      layer.msg('请先输入内容', {time: 1000});
    }else{
      if ((beginDate == "" || endDate == "") && (beginDate != "" || endDate != "")){
        layer.msg("请将时间范围填写完整", {time:1000});
      }else{
        if (beginDate != ""){
          searchword = searchword+"&beginDate="+beginDate+"&endDate="+endDate;
        }
        window.location.href=listurl+"?keyword="+keyword+searchword;
        
      }
    }
  });
    //年级查询按钮的事件处理
  $('#find').on('click',function(event) {
   var gradekey= document.getElementById('grade').value; 
     if (gradekey=="") {
          layer.msg('请先选择年级',{time:1000});
       }else{
          window.location.href=listurl+"?gradekey="+gradekey;
       }    
  });
  $('#searchAll').on('click', function(){

    window.location.href="{:U('Home/classMgr/classList')}";
  });

  var start = {
    istime: true, 
    format: 'YYYY-MM-DD', 
    festival: false,
      choose: function(datas){
        end.min = datas; //开始日选好后，重置结束日的最小日期
        end.start = datas //将结束日的初始值设定为开始日
      }
    };
    
    var end = {
      istime: true, 
    format: 'YYYY-MM-DD', 
    festival: false,
      choose: function(datas){
        start.max = datas; //结束日选好后，重置开始日的最大日期
      }
    };
    
    document.getElementById('beginDate').onclick = function(){
      start.elem = this;
      laydate(start);
    }
    document.getElementById('endDate').onclick = function(){
      end.elem = this
      laydate(end);
    }

  //编辑按钮功能
  $('.edit').on('click', function(){
    var id = $(this).data('id');
    
    layer.open({
      type: 2,
      title: ['修改班级信息', 'text-align:center;'],
      content: editurl+"?type=update&id="+id,
      area:['500px', '350px'],  //宽高
      resize: false,    //是否允许拉伸
      scrollbar: false,
      end: function(){
        location.reload();
      }
    });
    
  });
  //删除功能
 $('.del').on('click', function(){

    var id = $(this).data('id');
    layer.confirm('确定删除该班级?', {
      btn: ['确定', '取消']
    }, function(){
      $.ajax({
        url: deleteurl,
        type: 'POST',
        dataType: 'json',
        data: {'id': id},
        error: function(request){
          layer.msg("请求服务器超时", {time: 1000, icon: 5});
        },
        success: function(data){
          if (data.success){
            layer.msg(data.msg, {
              time: 1000
            }, function(){
              location.reload();
            });
          }else{
            layer.msg(data.msg, {
              time: 1000
            });
          }
        }
      });
      
    });
  });

})
</script>

